<template>
	<div class="adminBox">
		<el-card>
			<div class="headerTitle" style="padding: 20px">管理员输入</div>
			<div class="enterList">
				<div class="itemStyle" style="padding-top: 0">
					<div class="itemTitle">
						项目群设置
						<button class="subBtn" @click="handleProjects">
							提交
						</button>
					</div>
					<div class="radioGroup">
						<el-radio-group v-model="groupRadio">
							<el-radio :label="1">显示所有项目名称</el-radio>
							<el-radio :label="2">仅显示指定项目名称</el-radio>
						</el-radio-group>
						<div class="specificPro">
							<div>
								<div>
									<span>添加特定项目</span>
									<el-dropdown
										trigger="click"
										@command="addHandleCommand"
									>
										<span class="el-dropdown-link">
											请选择项目<el-icon
												class="el-icon--right"
											>
												<arrow-down />
											</el-icon>
										</span>
										<template #dropdown>
											<el-dropdown-menu>
												<el-dropdown-item
													v-for="item of state.proList"
													:key="item.id"
													:command="item"
													>{{ item.project_name }}
												</el-dropdown-item>
											</el-dropdown-menu>
										</template>
									</el-dropdown>
								</div>
								<div>
									<span>移除特定项目</span>
									<el-dropdown
										trigger="click"
										@command="delHandleCommand"
									>
										<span class="el-dropdown-link">
											请选择项目<el-icon
												class="el-icon--right"
											>
												<arrow-down />
											</el-icon>
										</span>
										<template #dropdown>
											<el-dropdown-menu>
												<el-dropdown-item
													v-for="item of state.yiList"
													:key="item.porject_id"
													:command="item"
													>{{ item.project_name }}
												</el-dropdown-item>
											</el-dropdown-menu>
										</template>
									</el-dropdown>
								</div>
							</div>
							<div class="proList">
								<div
									v-for="item of state.yiList"
									:key="item.id"
								>
									{{ item.project_name }}
								</div>
							</div>
						</div>
					</div>
				</div>

				<div class="itemStyle">
					<div class="itemTitle">
						项目基本信息
						<button class="subBtn" @click="handleProInfo">
							提交
						</button>
					</div>
					<div style="margin-top: 15px">
						<el-form
							:inline="true"
							class="demo-form-inline basicForm"
							label-position="left"
							label-width="90px"
							size="small"
							v-model="state.proInfo"
						>
							<el-form-item class="yz" label="业主公司简称">
								<el-input
									placeholder="请输入"
									v-model="state.proInfo.CompanyName"
								></el-input>
							</el-form-item>
							<el-form-item class="english" label="英文简称">
								<el-input
									placeholder="请输入"
									v-model="state.proInfo.ECompanyName"
								></el-input>
							</el-form-item>
							<el-form-item class="sendLogo" label="公司logo">
								<el-upload
									action="http://oao.zhichengshangxin.com/UploadsFile"
									:on-success="handleUpload"
									class="upload-demo"
									v-model="state.proInfo.Logo"
									auto-upload
								>
									<div class="iconfont icon-yunshangchuan_o">
										上传
									</div>
								</el-upload>
							</el-form-item>
							<el-form-item label="logo">
								<el-avatar
									:size="60"
									:src="`http://oao.zhichengshangxin.com/${state.proInfo.Logo}`"
								>
									<img
										src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"
									/>
								</el-avatar>
							</el-form-item>
							<el-form-item
								class="sketch"
								label="中央空调及其楼宇自控简述"
							>
								<el-input
									placeholder="请输入"
									type="textarea"
									v-model="state.proInfo.Describe"
								></el-input>
							</el-form-item>
							<div class="footInpForm">
								<el-form-item
									class="oaoSystem"
									label="OAO系统开始运作日期"
								>
									<el-date-picker
										v-model="state.proInfo.StartTime"
										type="date"
										placeholder="请选择开始日期"
									/>
								</el-form-item>
								<el-form-item
									class="oaoCost"
									label="OAO系统投入成本"
								>
									<el-input
										placeholder="请输入"
										v-model="state.proInfo.cost"
									></el-input>
								</el-form-item>
							</div>
						</el-form>
					</div>
				</div>

				<div class="energy">
					<div class="itemTitle">
						项目基本信息
						<button class="subBtn" @click="handleEnergy">
							提交
						</button>
					</div>

					<div class="monitor">
						<div class="energyTitle">OAO监管能耗</div>
						<div class="right">
							<div class="last">
								<div class="OAOTitle1">去年</div>
								<div></div>
								<div class="inputNum">
									<div>
										电<input
											placeholder="请输入"
											v-model="state.LastYear.electric"
										/>kWh
									</div>
									<div class="gas">
										天然气<input
											placeholder="请输入"
											v-model="state.LastYear.gas"
										/>m³
									</div>
									<div>
										市政热水<input
											placeholder="请输入"
											v-model="state.LastYear.water"
										/>kWh
									</div>
								</div>
							</div>
							<div class="beforeLast">
								<div class="OAOTitle1">前年</div>
								<div class="inputNum">
									<div>
										电<input
											placeholder="请输入"
											v-model="state.LastsYear.electric"
										/>kWh
									</div>
									<div class="gas">
										天然气<input
											placeholder="请输入"
											v-model="state.LastsYear.gas"
										/>m³
									</div>
									<div>
										市政热水<input
											placeholder="请输入"
											v-model="state.LastsYear.water"
										/>kWh
									</div>
								</div>
							</div>
						</div>
					</div>

					<div class="budget publicOAO">
						<div class="energyTitle">能耗预算（月）</div>
						<ProjectForm :tableData="state.tableData"></ProjectForm>
					</div>

					<div class="lastYear publicOAO">
						<div class="energyTitle">2021年能耗（月）</div>
						<ProjectForm
							:tableData="state.tableData2"
						></ProjectForm>
					</div>

					<div class="beforeLastYear publicOAO">
						<div class="energyTitle">2022年能耗（月）</div>
						<ProjectForm
							:tableData="state.tableData3"
						></ProjectForm>
					</div>
				</div>

				<div class="report">
					<div class="itemTitle">
						分析报告输入
						<button class="subBtn" @click="strategyBtn">
							提交
						</button>
					</div>
					<div class="reportInput">
						<div>
							<div>现场勘查问题</div>
							<div>
								<el-input
									v-model="state.ReportSub.scene"
									placeholder="请输入"
									type="textarea"
								></el-input>
							</div>
						</div>
						<div>
							<div>主要措施</div>
							<div>
								<el-input
									v-model="state.ReportSub.measures"
									placeholder="请输入"
									type="textarea"
								></el-input>
							</div>
						</div>
						<div>
							<div>租户/客户舒适度投诉</div>
							<div>
								<el-input
									v-model="state.ReportSub.complaint"
									placeholder="请输入"
									type="textarea"
								></el-input>
							</div>
						</div>
						<div>
							<div>舒适度投诉分析</div>
							<div>
								<el-input
									v-model="state.ReportSub.analysis"
									placeholder="请输入"
									type="textarea"
								></el-input>
							</div>
						</div>
						<div>
							<div>提升舒适度策略</div>
							<div>
								<el-input
									v-model="state.ReportSub.strategy"
									placeholder="请输入"
									type="textarea"
								></el-input>
							</div>
						</div>
					</div>
				</div>
			</div>
		</el-card>

		<el-card>
			<div style="padding: 20px"></div>
			<div class="cardRight">
				<div class="relevant">
					<div class="itemTitle">
						能源相关
						<button class="subBtn" @click="RelatedSubBtn">
							提交
						</button>
					</div>
					<div class="energyItem">
						<div>单位能耗标准</div>
						<div>
							合理值<input
								placeholder="请输入"
								v-model="RelatedSub.related.rational"
							/>kWh/m²y
						</div>
						<div>
							先进值<input
								placeholder="请输入"
								v-model="RelatedSub.related.advanced"
							/>kWh/m²y
						</div>
						<div>
							类似建筑<input
								placeholder="请输入"
								v-model="RelatedSub.related.build"
							/>kWh/m²y
						</div>
						<!-- <div>绿电价格<span>RMB</span><input placeholder="请输入"
								v-model="RelatedSub.related.electricity" />/kWh</div>
						<div>绿证价格<span>RMB</span><input placeholder="请输入" v-model="RelatedSub.related.card" />/kWh</div>
						<div>CCER价格<span>RMB</span><input placeholder="请输入" v-model="RelatedSub.related.ccer" />/tCO₂
						</div> -->
					</div>
					<div class="energyItem1">
						<div>
							绿电价格<span>RMB</span
							><input
								placeholder="请输入"
								v-model="RelatedSub.related.electricity"
							/>/kWh
						</div>
						<div>
							绿证价格<span>RMB</span
							><input
								placeholder="请输入"
								v-model="RelatedSub.related.card"
							/>/kWh
						</div>
						<div>
							CCER价格<span>RMB</span
							><input
								placeholder="请输入"
								v-model="RelatedSub.related.ccer"
							/>/tCO₂
						</div>
					</div>
				</div>

				<div class="company">
					<div class="itemTitle">
						<div>
							单位转换
							<span>*吨标煤 tce</span>
						</div>
						<button class="subBtn" @click="UnitSubBtn">提交</button>
					</div>

					<div class="companyItem">
						<div>
							<div>
								电<span
									>1kWh=<input
										v-model="UnitSub.unit.electric_kgco"
										placeholder="请输入" /></span
								>kgCO₂
							</div>
							<div>
								电<span
									>1kWh=<input
										v-model="UnitSub.unit.electric_tce"
										placeholder="请输入" /></span
								>tce
							</div>
						</div>
						<div>
							<div>
								天然气<span
									>1m3=<input
										v-model="UnitSub.unit.gas_kgco"
										placeholder="请输入" /></span
								>kgCO₂
							</div>
							<div>
								天然气<span
									>1m3=<input
										v-model="UnitSub.unit.gas_tce"
										placeholder="请输入" /></span
								>tce
							</div>
						</div>
						<div>
							<div>
								市政热水<span
									>1kWh=<input
										v-model="UnitSub.unit.card"
										placeholder="请输入" /></span
								>kgCO₂
							</div>
							<div>
								市政热水<span
									>1kWh=<input
										v-model="UnitSub.unit.ccer"
										placeholder="请输入" /></span
								>tce
							</div>
						</div>
					</div>
				</div>

				<div class="comfort">
					<div class="itemTitle">
						舒适度相关
						<button class="subBtn" @click="comfortBtn">提交</button>
					</div>
					<div class="temperature">
						<div>
							<div class="temperTitle">夏季舒适温度范围</div>
							<div>
								<input
									v-model="comfort.cosy.summer_min"
									placeholder="最低温度"
									type="text"
								/>
								<span>—</span>
								<input
									v-model="comfort.cosy.summer_max"
									placeholder="最高温度"
									type="text"
								/>
							</div>
						</div>
						<div>
							<div class="temperTitle">冬季舒适温度范围</div>
							<div>
								<input
									v-model="comfort.cosy.winter_min"
									placeholder="最低温度"
									type="text"
								/>
								<span>—</span>
								<input
									v-model="comfort.cosy.winter_max"
									placeholder="最高温度"
									type="text"
								/>
							</div>
						</div>
					</div>
				</div>

				<div class="economics">
					<div class="itemTitle">
						经济性相关
						<button class="subBtn" @click="EconomySubBtn">
							提交
						</button>
					</div>

					<div class="rate">
						<div>本地资本化率</div>
						<div>
							<el-input
								v-model="EconomySub.economy.capital"
								placeholder="请输入"
								size="small"
							></el-input>
						</div>
					</div>
				</div>

				<div class="ESG">
					<div class="itemTitle">
						ESG相关
						<button class="subBtn" @click="ESGBtn">提交</button>
					</div>

					<div>
						<div class="ESGinput">
							<div class="ESGTitle">可选条目输入</div>
							<div>
								<el-input
									v-model="ESG.esg.entry[0]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.entry[1]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.entry[2]"
									placeholder="请输入"
									size="small"
								></el-input>
							</div>
						</div>

						<div class="ESGinput">
							<div class="ESGTitle">对应条件：节能率</div>
							<div>
								<el-input
									v-model="ESG.esg.factor[0]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.factor[1]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.factor[2]"
									placeholder="请输入"
									size="small"
								></el-input>
							</div>
						</div>

						<div class="ESGinput">
							<div class="ESGTitle">对应得分</div>
							<div>
								<el-input
									v-model="ESG.esg.score[0]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.score[1]"
									placeholder="请输入"
									size="small"
								></el-input>
								<el-input
									v-model="ESG.esg.score[2]"
									placeholder="请输入"
									size="small"
								></el-input>
							</div>
						</div>
					</div>
				</div>

				<div class="keyEquip">
					<div class="itemTitle">
						关键设备
						<button class="subBtn" @click="keyDataListBtn">
							提交
						</button>
					</div>
					<div class="keyTable">
						<el-table
							:cell-style="{ textAlign: 'center' }"
							:data="keyDataList.facility"
							:header-cell-style="{ textAlign: 'center' }"
							border
							size="small"
						>
							<el-table-column label="序号" type="index">
							</el-table-column>
							<el-table-column label="设备名称" prop="name">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.name"
									/>
								</template>
							</el-table-column>
							<el-table-column label="设备编码" prop="number">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.number"
									/>
								</template>
							</el-table-column>
							<el-table-column label="检验时间" prop="time">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.time"
									/>
								</template>
							</el-table-column>
							<el-table-column label="检查人" prop="people">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.people"
									/>
								</template>
							</el-table-column>
							<el-table-column label="检查人手机" prop="tel">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.tel"
									/>
								</template>
							</el-table-column>
							<el-table-column label="设备说明书" prop="explain">
								<template #default="scope">
									<input
										type="text"
										v-model="scope.row.explain"
									/>
								</template>
							</el-table-column>
						</el-table>
					</div>
				</div>
			</div>
		</el-card>
	</div>
</template>

<script setup>
import { onMounted, reactive, ref, toRaw } from "vue";
import ProjectForm from "./projectForm.vue";
import {
	ProjectList,
	strategy,
	EsgSub,
	EconomySubs,
	CosySubs,
	UnitSubs,
	RelatedSubs,
	FacilitySubs,
	GroupSub,
	InfoSub,
	EnergySub,
	AdminInputs,
} from "@/api/model/admins";
import dayjs from "dayjs";
import {useStore} from 'vuex'
const store = useStore()
// 项目设置群单选绑定
let groupRadio = ref("");

// 关键设备数据
let keyDataList = reactive({
	facility: [
		{
			id: "1",
			name: "",
			time: "",
			number: "",
			people: "",
			tel: "",
			explain: "",
		},
		{
			id: "2",
			name: "",
			time: "",
			number: "",
			people: "",
			tel: "",
			explain: "",
		},
		{
			id: "3",
			name: "",
			time: "",
			number: "",
			people: "",
			tel: "",
			explain: "",
		},
	],
});

// 能源相关
let RelatedSub = reactive({
	related: {
		rational: "",
		advanced: "",
		build: "",
		electricity: "",
		card: "",
		ccer: "",
	},
});

const state = reactive({
	// 添加项目列表
	proList: [],
	// 移除项目列表
	yiList: [],
	// 项目基本信息
	proInfo: {},

	// 上传后返回的数据
	datas: "",

	// 去年能源碳
	LastYear: {},

	// 前年能源碳
	LastsYear: {},

	// 表一
	tableData: [
		{
			name: "电kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "天然气m³",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "市政热水kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
	],

	// 表二
	tableData2: [
		{
			name: "电kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "天然气m³",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "市政热水kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
	],

	// 表三
	tableData3: [
		{
			name: "电kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "天然气m³",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
		{
			name: "市政热水kWh",
			one: "",
			two: "",
			three: "",
			four: "",
			five: "",
			six: "",
			seven: "",
			eight: "",
			nine: "",
			ten: "",
			eleven: "",
			twelve: "",
		},
	],

	// 分析报告
	ReportSub: {},
});

// 单位转换
let UnitSub = reactive({
	unit: {
		electric_kgco: "",
		electric_tce: "",
		gas_kgco: "",
		gas_tce: "",
		card: "",
		ccer: "",
	},
});

// 舒适度相关
let comfort = reactive({
	cosy: {
		summer_min: "",
		summer_max: "",
		winter_min: "",
		winter_max: "",
	},
});
// 经济性相关数据
let EconomySub = reactive({
	economy: { capital: "" },
});

// ESG输入内容
let ESG = reactive({
	esg: {
		entry: [],
		factor: [],
		score: [],
	},
});

const delHandleCommand = function (item) {
	let index = state.yiList.indexOf(item);
	if (state.proList.findIndex(i=>i.project_id===item.project_id)<0) {
		state.proList.push(item)
	}
	
	index !== -1 && state.yiList.splice(index, 1);
};
// 关键设备按钮
let keyDataListBtn = async () => {
	await FacilitySubs(keyDataList);
	// await clears();
};
// 能源相关按钮
let RelatedSubBtn = async () => {
	await RelatedSubs(RelatedSub);
	// await clears();
};
//  单位转换按钮
let UnitSubBtn = async () => {
	await UnitSubs(UnitSub);
	// await clears();
};

// 舒适度相关
let comfortBtn = async () => {
	console.log(comfort.cosy);
	await CosySubs(comfort);
	// await clears();
};
// 经济性相关按钮
let EconomySubBtn = async () => {
	await EconomySubs(EconomySub);
	// await clears();
};
// ESG按钮
const ESGBtn = async () => {
	await EsgSub({ esg: ESG.esg });
};

// 清除分析报告
// const clears = () => {
// 	state.ReportSub.scene = "";
// 	state.ReportSub.measures = "";
// 	state.ReportSub.complaint = "";
// 	state.ReportSub.analysis = "";
// 	state.ReportSub.strategy = "";
// 	EconomySub.economy.capital = "";
// 	comfort.cosy = {
// 		summer_min: "",
// 		summer_max: "",
// 		winter_min: "",
// 		winter_max: "",
// 		// 获取项目列表
// 	};
// 	UnitSub.unit = {
// 		electric_kgco: "",
// 		electric_tce: "",
// 		gas_kgco: "",
// 		gas_tce: "",
// 		card: "",
// 		ccer: "",
// 	};
// 	RelatedSub.related = {
// 		rational: "",
// 		advanced: "",
// 		build: "",
// 		electricity: "",
// 		card: "",
// 		ccer: "",
// 	};
// 	keyDataList.facility = [
// 		{
// 			id: "1",
// 			name: "",
// 			time: "",
// 			number: "",
// 			people: "",
// 			tel: "",
// 			explain: "",
// 		},
// 		{
// 			id: "2",
// 			name: "",
// 			time: "",
// 			number: "",
// 			people: "",
// 			tel: "",
// 			explain: "",
// 		},
// 		{
// 			id: "3",
// 			name: "",
// 			time: "",
// 			number: "",
// 			people: "",
// 			tel: "",
// 			explain: "",
// 		},
// 	];
// };
// 提交分析报告输入按钮
let strategyBtn = async () => {
	await strategy({ report: state.ReportSub });
	// await clears();
};

const addHandleCommand = function (item) {
	item = toRaw(item);
	console.log(state.yiList, "ss");
	if (
		Array.from(state.yiList).find((i) => i.project_id === item.project_id)
	) {
		console.log(2);
		return state.yiList;
	} else {
		console.log(1);
		state.yiList.push(item);
		let ind = state.proList.findIndex(
			(items) => items.project_id == item.project_id
		);
		state.proList.splice(ind, 1);
	}
};

onMounted(() => {
	getProjectList();
	getHui();
});

const getHui = async () => {
	let res = await AdminInputs();
	console.log(res, "As");
	state.proInfo = JSON.parse(res.data.info);
	state.LastYear = JSON.parse(res.data.energy).LastYear;
	state.LastsYear = JSON.parse(res.data.energy).LastsYear;
	state.tableData = JSON.parse(res.data.energy).table1;
	state.tableData2 = JSON.parse(res.data.energy).table2;
	state.tableData3 = JSON.parse(res.data.energy).table3;
	state.ReportSub = JSON.parse(res.data.report);
	RelatedSub.related = JSON.parse(res.data.related);
	UnitSub.unit = JSON.parse(res.data.unit);
	comfort.cosy = JSON.parse(res.data.cosy);
	EconomySub.economy = JSON.parse(res.data.economy);
	ESG.esg = JSON.parse(res.data.esg);
	keyDataList.facility = JSON.parse(res.data.facility);
	// console.log(JSON.parse(res.data.group), "assss");


	groupRadio.value = JSON.parse(res.data.group)?.ShowProject || [];
	state.yiList = JSON.parse(res.data.group)?.Project || [];
};

// 获取项目列表
const getProjectList = async () => {
	let res = await ProjectList();
	console.log(res);
	if (res.status == 200) {
		state.proList = res.data;
	}
};

// 提交项目群设置
const handleProjects = async () => {
	let cc = [];
	console.log(state.yiList);
	state.yiList.forEach((item) => {
		cc.push({
			project_id: item.project_id,
			project_name: item.project_name,
		});
	});
	console.log(cc, "ccc");
	await GroupSub({ group: { ShowProject: groupRadio.value, Project: cc } });
};

// 上传项目的基本信息
const handleProInfo = async () => {
	state.proInfo.StartTime = dayjs(state.proInfo.StartTime).format(
		"YYYY-MM-DD"
	);
	sessionStorage.setItem("pimg", state.proInfo.Logo);
	sessionStorage.setItem("pname", state.proInfo.CompanyName);
	sessionStorage.setItem("epname", state.proInfo.ECompanyName);
	store.commit("setProject", {
		projectImg: state.proInfo.Logo,
		projectName: state.proInfo.CompanyName,
		enProjectName: state.proInfo.ECompanyName,
	});
	await InfoSub({ info: state.proInfo });
};

// 上传文件
const handleUpload = async (e) => {
	console.log(e);
	if (e.status == 200) {
		state.proInfo.Logo = e.data;
	}
};

// 能源碳
const handleEnergy = async () => {
	console.log(
		state.LastYear,
		state.LastsYear,
		state.tableData,
		state.tableData2,
		state.tableData3
	);
	let res = await EnergySub({
		energy: {
			LastYear: state.LastYear,
			LastsYear: state.LastsYear,
			table1: state.tableData,
			table2: state.tableData2,
			table3: state.tableData3,
		},
	});
	
	console.log("dian", res);
	// if (res.status == 200) {
		// state.LastYear = {};
		// (state.LastsYear = {}),
		// state.tableData = [
		// 	{
		// 		name: "电kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "天然气m³",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "市政热水kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// ];
		// state.tableData2 = [
		// 	{
		// 		name: "电kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "天然气m³",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "市政热水kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// ];
		// state.tableData3 = [
		// 	{
		// 		name: "电kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "天然气m³",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// 	{
		// 		name: "市政热水kWh",
		// 		one: "",
		// 		two: "",
		// 		three: "",
		// 		four: "",
		// 		five: "",
		// 		six: "",
		// 		seven: "",
		// 		eight: "",
		// 		nine: "",
		// 		ten: "",
		// 		eleven: "",
		// 		twelve: "",
		// 	},
		// ];
	// }
};
</script>

<style lang="less" scoped>
.keyTable {
	input {
		width: 7vw;
		line-height: 1.5vw;
		text-align: center;
		border: 0px;
	}
}

:deep(.el-card__body) {
	padding: 0;
}

.itemTitle {
	color: #646363;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;

	.subBtn {
		width: 95px;
		padding: 4px 0;
		border-radius: 4px;
		color: #fff;
		background: #8faadc;
		border: 1px solid #8faadc;
	}

	span {
		font-size: 12px;
		margin-left: 20px;
	}
}

.adminBox {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr;
	column-gap: 10px;
}

.enterList {
	padding: 20px 20px;

	.itemStyle {
		border-bottom: 1px dashed #a8a7a7;
		padding: 20px 0 10px;
	}

	.radioGroup {
		margin-top: 10px;
	}

	.el-radio-group {
		flex-direction: column;
		align-items: flex-start;

		.el-radio {
			flex-direction: row-reverse;
			width: 200px;
			margin: 0 !important;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.el-radio__input {
				margin-left: 10px;
			}

			.el-radio__label {
				padding: 0 !important;
			}
		}
	}

	.specificPro {
		display: flex;
		margin-top: 10px;
		justify-content: flex-end;

		& > div:first-child {
			height: 96px;
			margin-right: 20px;
			display: flex;
			flex-direction: column;
			justify-content: space-evenly;

			div {
				span {
					margin-right: 10px;
					font-size: 15px;
					color: #646363;
				}

				.el-dropdown {
					border: 1px solid #eee;
					padding: 3px 8px;
					border-radius: 4px;

					.el-dropdown-link {
						color: #cccccc;
						font-size: 13px;
					}

					i {
						margin: 0 5px;
					}
				}
			}
		}

		.proList {
			display: flex;
			flex-wrap: wrap;
			width: 300px;
			height: 80px;
			border: 1px solid #e7e7e7;
			border-radius: 4px;
			padding: 5px;

			div {
				padding: 0 5px;
				font-size: 13px;
			}
		}
	}
}

.basicForm {
	:deep(.el-form-item__label) {
		font-size: 13px !important;
	}

	:deep(.el-form-item__content) {
		width: 190px;
	}

	.sendLogo {
		width: 100%;
		margin-right: 0 !important;

		.el-upload {
			div {
				font-size: 15px;
				color: #4d62a5;
				display: flex;
			}

			.icon-yunshangchuan_o:before {
				font-size: 22px;
			}
		}
	}

	.yz {
		margin-right: 78px !important;
	}

	.english {
		margin-right: 0;
	}

	.sketch {
		width: 100%;
		margin-right: 0 !important;

		:deep(.el-form-item__label) {
			width: 175px !important;
		}

		:deep(.el-textarea__inner) {
			resize: none;
		}
	}

	.footInpForm {
		display: flex;
		justify-content: space-between;
	}

	.oaoSystem {
		margin-right: 0 !important;

		:deep(.el-form-item__label) {
			width: 172px !important;
		}

		:deep(.el-form-item__content) {
			width: 145px;
		}
	}

	.oaoCost {
		margin-right: 0 !important;

		:deep(.el-form-item__label) {
			width: 130px !important;
		}

		:deep(.el-form-item__content) {
			width: 145px;
		}
	}
}

.energy {
	border-bottom: 1px dashed #a8a7a7;
	padding: 20px 0;

	.energyTitle {
		width: 25%;
		font-size: 14px;
	}

	.monitor {
		margin-top: 15px;
		font-size: 14px;
		display: flex;
		justify-content: space-between;

		.right {
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			width: 75%;

			input {
				width: 50px;
				border: 1px solid #d8d8d8;
				padding: 1px 3px;
				border-radius: 4px;
				margin: 0 5px;
			}

			& > div {
				display: flex;
				margin-bottom: 15px;
				width: 100%;
				justify-content: space-between;
			}

			.OAOTitle1 {
				margin-right: 11px;
			}
		}
	}

	.inputNum {
		display: flex;
		margin-right: 70px;
		font-size: 13px;
		div {
			margin-left: 50px;
		}
	}
}

.publicOAO {
	display: flex;
	margin-top: 20px;

	:deep(.el-table__header) {
		width: 100% !important;

		thead {
			tr > th {
				background: #cddaee !important;
				color: #171717;
			}
		}
	}

	:deep(.el-table__body) {
		width: 100% !important;

		tbody {
			tr {
				background: #f6f8fb;
			}

			.cell {
				padding: 0 !important;
				text-align: center;
			}
		}
	}
}

.report {
	margin-top: 20px;

	.reportInput {
		& > div {
			display: flex;
			justify-content: space-between;
			margin-top: 20px;
			font-size: 14px;

			& > div:first-child {
				width: 25%;
			}

			& > div:last-child {
				width: 75%;
			}

			.el-textarea {
				height: 100px;

				:deep(.el-textarea__inner) {
					height: 100%;
					resize: none;
				}
			}
		}
	}
}

.cardRight {
	padding: 20px 20px 0;

	.relevant {
		border-bottom: 1px dashed #a8a7a7;
		padding: 20px 0;

		.energyItem {
			font-size: 12px;
			display: flex;
			flex-wrap: wrap;

			& > div:nth-child(2) {
				margin-left: 15px;
			}

			div {
				padding: 20px 82px 0 0;
			}

			span {
				margin-left: 10px;
			}

			input {
				width: 50px;
				border: 1px solid #d8d8d8;
				padding: 1px 3px;
				border-radius: 4px;
				margin: 0 5px;
			}
		}
		.energyItem1 {
			font-size: 12px;
			display: flex;
			flex-wrap: wrap;

			& > div:nth-child(2) {
				margin-left: 15px;
			}

			div {
				padding: 20px 100px 0 0;
			}

			span {
				margin-left: 10px;
			}

			input {
				width: 50px;
				border: 1px solid #d8d8d8;
				padding: 1px 3px;
				border-radius: 4px;
				margin: 0 5px;
			}
		}
	}
}

.company {
	border-bottom: 1px dashed #a8a7a7;
	padding: 20px 0;

	.companyItem {
		display: flex;
		align-items: center;
		justify-content: space-between;

		& > div {
			margin-top: 0 !important;
		}

		div {
			margin-top: 15px;
		}

		span {
			padding: 0 10px 0 20px;
		}

		input {
			width: 50px;
			border: 1px solid #d8d8d8;
			padding: 1px 3px;
			border-radius: 4px;
			margin: 0 5px;
		}
	}
}

.comfort {
	border-bottom: 1px dashed #a8a7a7;
	padding: 20px 0;

	.temperature {
		margin-top: 15px;
		display: flex;
		justify-content: space-between;
		font-size: 13px;

		& > div {
			display: flex;

			.temperTitle {
				margin-right: 15px;
			}

			span {
				font-weight: 600;
				color: #e6e7e7;
			}
		}

		input {
			width: 70px;
			border: 1px solid #d8d8d8;
			padding: 1px 3px;
			border-radius: 4px;
			margin: 0 5px;

			&::placeholder {
				color: #d8d8d8;
			}
		}
	}
}

.economics {
	border-bottom: 1px dashed #a8a7a7;
	padding: 20px 0;

	.rate {
		display: flex;
		align-items: center;
		font-size: 13px;
		margin-top: 15px;

		& > div:last-child {
			margin-left: 40px;
		}
	}
}

.ESG {
	border-bottom: 1px dashed #a8a7a7;
	padding: 20px 0;

	.ESGinput {
		display: flex;
		justify-content: space-between;
		margin-top: 15px;

		& > div:last-child {
			display: flex;
			justify-content: space-between;

			.el-input {
				width: 150px;
				margin-right: 20px;
			}
		}
	}

	.ESGTitle {
		margin-right: 10px;
	}
}

.keyEquip {
	padding: 20px 0;

	.keyTable {
		margin-top: 20px;
	}
}
</style>
